<!doctype html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title></title>
    <style type="text/css">
*{margin: 0;padding: 0;list-style: none;}
html,body{
	height: 100%;
}
div{
	transition:.5s all ease;
}

@media screen and (max-width: 600px){
	 div{
	 	width: 200px;height: 200px;
	 	background: blue;
	 }
}

@media screen and (min-width: 600px) and (max-width: 800px) {
	 div{
	 	width: 300px;height: 300px;
	 	background: aqua;
	 }
}

@media screen and (min-width: 800px) {
	div{
		width: 50px;background: pink;
		height: 400px;
	}
}


    </style> 
</head>
<body>
	<div></div>
</body>
</html>